import React from 'react';
import PropTypes from 'prop-types';
import Gesture from 'components/gesture';
import EVENTS_CONST from 'common/const/events';
import ACTIONES_CONST from 'common/const/events/actions';
import { observer } from 'mobx-react';

@observer
export default class Events extends React.Component {
  static propTypes = {
    mod: PropTypes.object.isRequired,
  };

  constructor() {
    super();
    this.state = {
      animation: null,
      strongAnimationTimes: 0
    };
  }

  // 设置手势事件
  setEvents() {
    const { mod } = this.props;
    let events = {};
    mod.events.forEach(event => {
      EVENTS_CONST.forEach(e => {
        if (event.eventKey === e.key) {
          events[e.event] = this.eventTrigger(event.actionKey, event.actionDetail);
          // console.log('event', event);
        }
      });
    });
    // console.log('events', events);
    return events;
  };

  // 事件触发
  eventTrigger(actionKey, actionDetail) {
    // console.log('actionDetail', actionDetail);
    const action = ACTIONES_CONST.filter(item => item.key === actionKey)[0];
    if (action) return () => action.action(actionDetail);
  };

  render() {
    return (
      <Gesture {...this.setEvents()}>
        {this.props.children}
      </Gesture>
    );
  }
}

